<template>
	<view>
		<u-sticky bgColor="#fff" :enable="true">
			<u-tabs :list="tabsList" :is-scroll="false" active-color="#3059c9" :current="tabsCurrent"
				@change="tabsChange"></u-tabs>
		</u-sticky>
	<view v-if="tabsCurrent === 0">
		<view class="rules">
			<view class="" v-for="(item,index) in rulesList">
				<view class="rules-content">
					<view class="rc-left">{{item.name}}</view>
					<view class="rc-right">{{item.type == 0 ? '+' : '-'}}{{item.pointsValue}}积分</view>
				</view>
				<view class="rule-space">
					
				</view>
			</view>
		</view>
		</view>
		
	</view>
</template>

<script>
	import {pointsSettingsList} from '@/utils/api.js'
	export default {
		data() {
			return {
				tabsList: [{
						name: '积分规则',
						disabled: false
					},
					{
						name: '积分说明',
						disabled: false
					},
					
				],
				tabsCurrent: 0,
				rulesList:[],
			}
		},
		onLoad() {
			this.pointsSettingsList()
		},
		methods: {
			tabsChange(index) {
				this.tabsCurrent = index;
			},
			async pointsSettingsList(){
				uni.showLoading()
				const {code,rows} = await pointsSettingsList()
				if(code == 200){
					uni.hideLoading()
				    this.rulesList = rows
				}
			 	
			},
		}
	}
</script>

<style>
.rules{
	width: 95%;
	margin: 20rpx auto;
	background-color: #ffffff;
}
.rules-content{
	display: flex;
	justify-content: space-between;
	padding: 30rpx 20rpx;
	font-size: 24rpx;
}
.rule-space{
	width: 90%;
	height: 2rpx;
	background-color: #e4e4e4;
	margin: 0 auto;
}
.rc-right{
	color: #ff8d01;
}

</style>
